<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <label for="username">用户名：</label>
    <input type="text" id="username">
    <br>
    <label for="password">密码： </label>
    <input id="password" type="password"/> 
    <input type="button" id="submitBtn" value="提交">
</body>
<script>
    Function.prototype.before = function(beforeFn) {
        let _self = this;
        return function() {
            if (beforeFn.apply(this, arguments) === false) {
                return;
            }
            return _self.apply(this, arguments);
        }
    }
</script>
<script>
    let username = document.getElementById('username');
    let password = document.getElementById('password');
    let submitBtn = document.getElementById('submitBtn');

    const validate = function() {
        if (!username.value) {
            alert('用户名不能为空');
            return false;
        }

        if (!password.value) {
            alert('密码不能为空');
            return false;
        }
    }

    let formSubmit = function() {
        let param = {
            username: username.value,
            password: password.value
        }
        console.log(param);
        // ......
    }

    formSubmit = formSubmit.before(validate);

    submitBtn.onclick = function() {
        formSubmit();
    }
</script>
</html>